<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title></title>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="css/bootstrap.css"/>
    <link rel="stylesheet" type="text/css"
          href="css/bootstrap-responsive.css"/>
    <link rel="stylesheet" type="text/css" href="css/style.css"/>
    <script type="text/javascript" src="js/bootstrap.js"></script>
    <script type="text/javascript" src="js/ckform.js"></script>
    <script type="text/javascript" src="js/common.js"></script>
    <script src="js/jquery.min.js?v=2.1.4"></script>
    <style type="text/css">
        body {
            font-size: 20px;
            padding-bottom: 40px;
            background-color: #e9e7ef;
        }

        .sidebar-nav {
            padding: 9px 0;
        }

        @media ( max-width: 980px) {
            /* Enable use of floated navbar text */
            .navbar-text.pull-right {
                float: none;
                padding-left: 5px;
                padding-right: 5px;
            }
        }
    </style>
</head>
<body>
<form class="form-inline definewidth m20" action="#" method="get">
    <font color="#777777"><strong>大类信息：</strong></font>

</form>
<table class="table table-bordered table-hover definewidth m10">
    <thead>
    <tr>
        <th>大类名称</th>
        <th>类别描述</th>
        <th>查看小类</th>
        <th>小类管理</th>
        <th>修改</th>
        <th>删除</th>
    </tr>
    </thead>
    <tbody id="tbody">
    <%--存放数据行--%>
    <tr>
        <%--            <td>娱乐</td>--%>
        <%--            <td>当前了别是影视评价的博客类别</td>--%>
        <td>
            <%--                <select>--%>
            <%--                    <option/>&nbsp;电影</option>--%>
            <%--                    <option/>&nbsp;原创</option>--%>
            <%--               </select>--%>
        </td>
        <td>
            <%--                <button type="submit"><a href="subtype_list.jsp">管理小类</a></button>--%>
        </td>
        <td>
            <%--                <button type="submit"><a href="type_update.jsp">修改</a></button>--%>
        </td>
        <td>
            <%--                <button type="submit">删除</button>--%>
        </td>
    </tr>
    </tbody>
</table>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<button type="button" id="addnew">
    <a href="type_add.jsp">添加大类</a>
</button>
<script type="text/javascript">

    $(function () {
        //列表查询
        findAll();
    })

    //加载所有大类别信息
    function findAll() {
        $.get("/btype/findAll", function (result) {
            $(result).each(function (index, item) {
                var trs = `<tr>
                        <td style="display: none">` + item.typeid + `</td>
                        <td>` + item.typename + `</td>
                        <td>` + item.typedes + `</td>
                        <td>
                            <select class="subType" id=` + index + ` style="width: 110px" >
                                <option/>&nbsp;查询小类</option>
                            </select>
                        </td>
                        <td>
                            <button type="submit"><a href="subtype_list.jsp?typeid=` + item.typeid + `">管理小类</a></button>
                        </td>
                        <td>
                            <button type="button"><a href="type_update.jsp?typeid=` + item.typeid + `">修改</a></button>
                        </td>
                        <td>
                           <button id="deleteBtn" class="deleteBtn" type="button"> 删除 </button>
                        </td>
                     </tr>`;
                $("#tbody").append(trs);
            });

        });
    }

    //追加大类别下的小类别：
    $(document).on('click', '.subType', function () {
        //点击的select 组件：定义变量保存。
        var $select = $(this);
        $select.empty();//清空
        var typeid = $(this).parents("tr").children().eq(0).text();
        $.get("/btype/findSubTypeByTid?typeid=" + typeid, function (result) {
            $(result).each(function (index, item) {
                var $option = `<option>` + item.typename + `</option>`;
                $select.append($option);
            });
        });
    });
    //删除大类
    //删除大类别
    $(document).on('click', '.deleteBtn', function () {
        var flag = window.confirm("您确定要删除吗?");
        if (flag) {
            var typeid = $(this).parents("tr").children().eq(0).text();
            $.get("/btype/deleteSubTypeBtn?typeid=" + typeid, function (result) {
                if (result.msg) {
                    alert(result.msg);
                    window.location.reload();
                } else {
                    alert(result.error);
                }
            });
        }
    });

</script>
</body>
</html>